
(function(){
	// 公式：ab   a+b  (a*10+b)-(a+b) = 9a;
			  // 46  4+6    4*10+6  - 10  36
	var num = 96;
	var html = "";
	var timer = null;
	var timeout = null;
	var toggle = true;
	createDom();
	$(".btnRe").click(function(){
		end();
		change();
		$(".showbox").removeClass("on").children("img").attr("src","");
		toggle = true;
	})
	$(".showbox").click(function(){
		if(toggle){
			toggle = false;
			var resultImg = $(".wrap>div").eq(8).children("img").attr("src");
			var timer2 = setInterval(function(){
				var random = Math.floor(Math.random()*96+1);
				$(".showbox").children("img").attr("src",`img/read_heart/${random}.png`);
			},600/60)
			var timer3 = setTimeout(function(){
				clearInterval(timer2);
				$(".showbox").addClass("on");
				$(".showbox").children("img").attr("src",`${resultImg}`);
			},600)
		}
		
	})
	function createDom(){
		for (var i = 1; i <= num; i++) {
			var random = Math.floor(Math.random()*96+1);
			if(i/9 == 1){
				var random9 = Math.floor(Math.random()*96+1);
			}
			if(i%9 == 0){
				html += `<div><img src="img/read_heart/${random9}.png"><span>${i}</span></div>`;
			}else{
				html += `<div><img src="img/read_heart/${random}.png"><span>${i}</span></div>`;
			}
		}
		$(".wrap").html(html);
	}
	function change(){
		timer = setInterval(function(){
			html="";
			createDom();
			toggle=false;
		},1000/60);
		timeout = setTimeout(function(){
			clearInterval(timer);
			toggle=true;
		},1000)
	}
	function end(){
		clearInterval(timer);
		clearTimeout(timeout);
	}
})()